<template>
  <div class="count">
    <h1>id:{{id}}</h1>
    <h1>{{count}}</h1>
    <button @click="add(num)">累加</button>
    <button @click="getEle">打印实例</button>
  </div>
</template>

<script>
export default {
    name:'Count',
    data(){
        return {
            count:0
        }
    },
    props:{
        num:{
            type:Number
        },
        id:{
            type:String,
            required:true,
            default:Date.now()
        }
    },
    methods:{
        getEle(){
            console.log(this);
        },
        add(num){
            this.count+=num
        }
    }
}
</script>

<style scoped>
    .count{
        height: 200px;
        background-color: red;
    }
</style>